// 商品分类全局组件的小仓库
import { defineStore } from 'pinia'
import { reqC1, reqC2, reqC3 } from '@/api/product/attr/index'
import type { CategoryResponseData } from '@/api/product/attr/type'
import type { CategoryState } from './types/type'

const useCategoryStore = defineStore('Category', {
  state: (): CategoryState => {
    return {
      // 存储一级分类的数组
      c1Arr: [],
      // 存储一级分类的id
      c1Id: '',
      // 存储二级分类的数组
      c2Arr: [],
      // 存储二级分类的id
      c2Id: '',
      // 存储三级分类的数组
      c3Arr: [],
      // 存储三级分类的id
      c3Id: '',
    }
  },
  actions: {
    async getC1() {
      // // 清除数据
      // this.c2Arr = []
      // this.c3Arr = []
      // this.c2Id = ''
      // this.c3Id = ''
      const res: CategoryResponseData = await reqC1()
      // console.log('c1', res)
      if (res.code == 200) {
        this.c1Arr = res.data
      }
    },
    // 获取二级分类的数据
    async getC2() {
      // // 清除数据
      // this.c3Arr = []
      // this.c3Id = ''
      // 获取一级分类下的二级分类的数据
      const res: CategoryResponseData = await reqC2(this.c1Id)
      // console.log('c2', res)
      if (res.code == 200) {
        this.c2Arr = res.data
      }
    },
    // 获取三级分类的数据
    async getC3() {
      // 获取一级分类下的二级分类的数据
      const res: CategoryResponseData = await reqC3(this.c2Id)
      // console.log('c3', res)
      if (res.code == 200) {
        this.c3Arr = res.data
      }
    },
  },
  getters: {},
})

export default useCategoryStore

// import { ref, reactive, onMounted } from 'vue'
// import { reqC1 } from '@/api/product/attr'

// const c1Arr = ref([])
// const c2Arr = ref([])
// const c3Arr = ref([])

// // const c1Id = ref<number | string>('')
// const categoryForm = reactive({
//   category1Id: '',
//   category2Id: '',
//   category3Id: '',
// })
// // 获取一级分类的数据的方法
// const getC1 = async () => {
//   let res = await reqC1()
//   console.log('er', res);

//   if (res.code == 200) {
//     c1Arr.value = res.data
//   }
// }

// onMounted(() => {
//   getC1()
// })

// const handler1 = () => {
//   //
// }
